// Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
// 
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
// 
//     http://www.apache.org/licenses/LICENSE-2.0
// 
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

@import './config'

form.survey
  width 75%
  display flex
  flex-direction column
  align-items center
  // text-ellipsis()

  > *
    width 100%

  .survey-top
    position sticky
    top 0
    left 0
    background-color $color.background
    display flex
    justify-content space-between
    margin-bottom $gap

  .survey-title
    font-size 4rem
    font-weight bold

  .survey-toolbar
    display flex
    justify-content flex-end
    padding $gap $gap $gap 0

    button
      margin-right $gap
      background-color $color.primary
      color $color.white
      padding 0.8rem 1.2rem
      border 0.4rem transparent
      cursor pointer
      font-size 1.6rem
      transition background-color 0.2s ease

      &:hover
        background-color $color.primary-dark

.adder
  display grid
  padding 2 * $gap
  border-radius 0.4rem
  grid-template-columns repeat(3, 1fr)
  gap $gap

  &.popup
    width 40rem
    position absolute
    left 0
    top 0
    background-color $color.white
    box-shadow 0 0.4rem 0.8rem $color.shadow-dark

  button
    white-space nowrap
    overflow hidden
    text-overflow ellipsis
    padding 0.4rem 0.6rem
    cursor pointer
    transition background-color 0.2s ease

.q button.add
  width 10rem
  padding 0.6rem 1.2rem
  background none
  border-radius 0.2rem
  border 0.1rem $color.border-lighter
  cursor pointer
  transition all 0.2s ease

  &:hover
    background-color $color.border-lighter